<%@ page import="com.lanqiao.guimei.dao.CateGoryDao" %>
<%@ page import="com.lanqiao.guimei.vo.Category" %>
<%@ page import="java.util.List" %><%--
  Created by IntelliJ IDEA.
  User: Lu
  Date: 2019/8/14/014
  Time: 15:21
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

<html>
<head>
    <base href="${pageContext.request.contextPath}/">
    <title>首页</title>
    <link rel="stylesheet" href="css/front/front-index.css">
    <script src="js/front-js/front-head.js"></script>
    <link rel="stylesheet" href="css/bootstrapcss/bootstrap.css">
    <script src="js/jquery-2.2.4.js"></script>
    <script src="js/bootstrap.js"></script>
</head>
<style>
.head-font-color ul li a{
    padding-top: 15px;
    width: 88px;
    height: 57px;
}
</style>
<script>
    //图片自动3秒轮播
    $(function () {
        $('#header').load('herder.html');
        $('#myCarousel').carousel({interval:2000});


        $('#lbtn').mouseover(function () {
            $('#rbmhead').removeClass('rbmhead1');
            $('#rbmhead').addClass('rbmhead');
            $("#tabimg").attr('src','image/tab1.jpg');
        });
        $('#rbtn').mouseover(function () {
            $('#rbmhead').removeClass('rbmhead');
            $('#rbmhead').addClass('rbmhead1');
            $("#tabimg").attr('src','image/tab2.gif');
        });

    });
</script>

<body >
<div>
</div>
<%--导入头部--%>
<jsp:include page="front-head.jsp"></jsp:include>


<div class="col-md-1 column">
</div>

<div class="col-md-9 column">
    <%--左侧栏商品分类--%>
    <div class="col-md-3 column">
        <div class="index-left">
            <div class="left-head"></div>

            <div class="left-title">家用电器</div>
            <div class="left-tab">
                <div class="row">
                    <c:forEach var="item" items="${list1}" >
                        <div class="col-md-4"><a href="#">${item.ctgrName}</a></div>
                    </c:forEach>
                </div>
            </div>
            <div class="left-title">服饰箱包</div>
            <div class="left-tab">
                <div class="row">
                    <c:forEach var="item" items="${list2}" >
                        <div class="col-md-4"><a href="#">${item.ctgrName}</a></div>
                    </c:forEach>
                </div>
            </div>
            <div class="left-title">手 机</div>
            <div class="left-tab">
                <div class="row">
                    <c:forEach var="item" items="${list3}" >
                        <div class="col-md-4"><a href="#">${item.ctgrName}</a></div>
                    </c:forEach>
                </div>
            </div>
            <div class="left-title">数 码</div>
            <div class="left-tab">
                <div class="row">
                    <c:forEach var="item" items="${list4}" >
                        <div class="col-md-4"><a href="#">${item.ctgrName}</a></div>
                    </c:forEach>
                </div>
            </div>
        </div>

        <img src="image/play2.png" alt="" style="width: 250px;height: 80px" >

        <%--小老鼠动画--%>
        <div className="sidebarMouse"><object type="application/x-shockwave-flash" style="outline:none;"          data="https://files.cnblogs.com/files/jingmoxukong/mouse.swf?up_bodyColor=f0e9cc&amp;up_feetColor=D4C898&amp;up_eyeColor=000567&amp;up_wheelSpokeColor=DEDEDE&amp;up_wheelColor=FFFFFF&amp;up_waterColor=E0EFFF&amp;up_earColor=b0c4de&amp;up_wheelOuterColor=FF4D4D&amp;up_snoutColor=F7F4E9&amp;up_bgColor=F0E4E4&amp;up_foodColor=cba920&amp;up_wheelCenterColor=E4EB2F&amp;up_tailColor=E6DEBE&amp;"          width="240" height="160"><param name="movie"           value="https://files.cnblogs.com/files/jingmoxukong/mouse.swf?up_bodyColor=f0e9cc&amp;up_feetColor=D4C898&amp;up_eyeColor=000567&amp;up_wheelSpokeColor=DEDEDE&amp;up_wheelColor=FFFFFF&amp;up_waterColor=E0EFFF&amp;up_earColor=b0c4de&amp;up_wheelOuterColor=FF4D4D&amp;up_snoutColor=F7F4E9&amp;up_bgColor=F0E4E4&amp;up_foodColor=cba920&amp;up_wheelCenterColor=E4EB2E&amp;up_tailColor=E6DEBE&amp;"><param name="AllowScriptAccess" value="always"><param name="wmode" value="opaque"></object></div>

    </div>

        <%--中间栏--%>
    <div class="col-md-6 column">
        <%--轮播图--%>
     <div class="row">
         <div id="myCarousel" class="carousel slide">
             <ol class="carousel-indicators">
                 <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
                 <li data-target="#myCarousel" data-slide-to="1"></li>
                 <li data-target="#myCarousel" data-slide-to="2"></li>
             </ol>
             <div class="carousel-inner">
                 <div class="item active">
                     <img src="image/product/s_big_1.jpg" style="width: 555px;height: 250px"/></div>
                 <div class="item">
                     <a href=""><img src="image/qiang.png" style="width: 555px;height: 250px" /></a></div>
                 <div class="item">
                     <img src="image/qiang.png" style="width: 555px;height: 250px"/></div>
             </div>
             <a class="carousel-control left" href="#myCarousel" role="button" data-slide="prev">
                 <br><br> <br><br>
                 <span><</span>
             </a>
             <a class="carousel-control right" href="#myCarousel" role="button" data-slide="next">
                 <br><br> <br><br>
                 <span>></span>
             </a>
         </div>

    </div>
        <%--疯狂抢购--%>
            <div class="row">
     <div class="centerbottom">
                <div class="center-title"><span style="padding-left: 100px"><a href=""> 查看更多>> </a></span> </div>
                <div class="center-tab">
                    <table>
                        <tr class="imghref">
                            <td><a href="#"><img src="image/product/s_big_1.jpg" alt=""></a></td>
                            <td><a href="#"><img src="image/product/s_big_2.jpg" alt=""></a></td>
                            <td><a href="#"><img src="image/product/s_big_1.jpg" alt=""></a></td>
                        </tr>
                        <tr class="texthref">
                            <td><a href="#">惠普商务移动应用英寸笔记本</a></td>
                            <td><a href="#">夏新N6 GPS真人语音导航手机... </a></td>
                            <td><a href="#">三星家庭影院 HT-TZ325购机送...</a></td>
                        </tr>
                        <tr class="imghref">
                            <td><a href="#"><img src="image/laser-pen.jpg" alt=""></a></td>
                            <td><a href="#"><img src="image/mouse.jpg" alt=""></a></td>
                            <td><a href="#"><img src="image/earphone.jpg" alt=""></a></td>
                        </tr>
                        <tr class="texthref">
                            <td><a href="#">明基MP512投影机 2899元 送...</a></td>
                            <td><a href="#">夏新N6 GPS真人语音导航手机...</a></td>
                            <td><a href="#">三星家庭影院 HT-TZ325购机送...</a></td>
                        </tr>
                        <tr class="imghref">
                            <td><a href="#"><img src="image/Wancom.jpg" alt=""></a></td>
                            <td><a href="#"><img src="image/Frame.jpg" alt=""></a></td>
                            <td><a href="#"><img src="image/notebook.jpg" alt=""></a></td>
                        </tr>
                        <tr class="texthref">
                            <td><a href="#">亚马逊随时阅读，随时记录...</a></td>
                            <td><a href="#">优雅相框...</a></td>
                            <td><a href="#">IBM2009最新上网本...</a></td>
                        </tr>
                    </table>
                </div>
            </div>
            </div>
    </div>

        <%--右侧栏--%>
    <div class="col-md-3 column">

        <div height="130" width="150" align="center"><embed height="120" width="150" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" src="http://chabudai.sakura.ne.jp/blogparts/honehoneclock/honehone_clock_wh.swf" quality="high" autostart="1" wmode="transparent"></div>


        <div class="right-body">
            <div class="rihead">
                <div class="rhhead"></div>
                <div class="rhbody">
                    <div class="rhbleft"><img src="image/toy.png" alt=""></div>
                    <div class="rhbright">
                        <a href="#">大学要求老师开网店</a><br>
                        <a href="#">安全锤网上大热销</a><br>
                        <a href="#">商城竟成网购试衣间</a><br>
                        <a href="#">2万网上开十家连锁店</a><br>
                    </div>
                </div>
            </div>
            <%--新品上架--%>
            <div class="ricenter">
                <div class="rchead"><span> <a href="">............</a></span></div>
                <div class="rcbody">
                    <div class="rcbleft">
                        <ul>
                            <li><a href="details.html"><img src="image/show1.jpg" alt=""></a></li>
                            <li><a href="details.html"><img src="image/show2.jpg" alt=""></a></li>
                            <li><a href="details.html"><img src="image/show5.jpg" alt=""></a></li>
                            <li><a href="details.html"><img src="image/show4.jpg" alt=""></a></li>
                        </ul>
                    </div>
                    <div class="rcbright">
                        <ul>
                            <li><a href="details.html">大牌狂降价，三折直送</a></li>
                            <li><a href="details.html">大学要求老师开网店</a></li>
                            <li><a href="details.html">黑眼眶推荐，美白不停</a></li>
                            <li><a href="details.html">瘦身狂潮风，修形之选</a></li>
                        </ul>
                    </div>
                </div>
            </div>
            <div class="ribottom">
                <div class="rbmhead" id="rbmhead">
                    <div class="lbtn">
                        <button id="lbtn"></button>
                    </div>
                    <div class="rbtn">
                        <button id="rbtn"></button>
                    </div>
                </div>
                <div class="rbmbody">
                    <img id="tabimg" src="image/tab1.jpg" alt="" >
                </div>
            </div>
        </div>
 </div>
</div>



<div class="row">
    <div class="col-md-12"></div>
</div>

<div class="col-md-2 column">
</div>





<br><br>
<%--尾部--%>
  <div class="row" style="color: black">
    <jsp:include page="front-after.jsp"></jsp:include>
  </div>

</body>
</html>
